<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="<{$ipath}>app/hotel/style/room_storey.css"/>
</head>
<body>
<div class="boxwrap">
<div class="wrap">
    <h3>房态图</h3>
    <!--<p class="print"><a href="##">打印</a></p>-->
    <div class="selected">
        <form action="?m=manage&a=index" method="post">
        <ul class="list">
            <li>
                <span>房型</span>
                <select name="tid">
                    <option value="">请选择</option>
                    <{foreach from=$types item=v key=k}>
                    <option value="<{$v.id}>"<{if isset($pam['tid']) && $v.id == $pam['tid']}> selected='selected'<{/if}>><{$v.name}></option>
                    <{/foreach}>
                </select>
            </li>
            <li>
                <span>房态</span>
                <select name="rtype">
                    <option value="">请选择</option>
                    <{foreach from=$rtypes item=vv key=kk}>
                    <option value="<{$kk}>"<{if isset($pam['rtype']) && $kk == $pam['rtype']}> selected='selected'<{/if}>><{$vv}></option>
                    <{/foreach}>
                </select>
            </li>
            <li>
                <span>特征</span>
                <select name="facid">
                    <option value="">请选择</option>
                    <{foreach from=$facs item=vvv key=kkk}>
                    <option value="<{$vvv.id}>"<{if isset($pam['facid']) && $vvv.id == $pam['facid']}> selected='selected'<{/if}>><{$vvv.name}></option>
                    <{/foreach}>
                </select>
            </li>
            <li>
                <span>楼层</span>
                <select name="fid">
                    <option value="">请选择</option>
                    <{foreach from=$floors item=vvvv key=kkkk}>
                    <option value="<{$vvvv.id}>"<{if isset($pam['fid']) && $vvvv.id == $pam['fid']}> selected='selected'<{/if}>><{$vvvv.num}></option>
                    <{/foreach}>
                </select>
            </li>
        </ul>
        <div class="box"><input class="box_text" type="text" name="rname" value="<{$pam['rname']}>" placeholder="请输入房号"/><input class=box_submit type="submit" value=""/></div>
        </form>
    </div>
    <div class="tab">
        <ul class="head">
            <li class="total" onclick="sou(0)">全部<span> | <{$rnum}>间 | 100%</span></li>
            <li class="empty" onclick="sou(1)">空房<span> | <{if isset($nums[1]['nums'])}><{$nums[1]['nums']}><{else}>0<{/if}>间 | <{if isset($nums[1]['nums'])}><{sprintf("%.2f",$nums[1]['nums']/$rnum)*100}>%<{else}>0%<{/if}></span></li>
            <li class="reside" onclick="sou(2)">在住<span> | <{if isset($nums[2]['nums'])}><{$nums[2]['nums']}><{else}>0<{/if}>间 | <{if isset($nums[2]['nums'])}><{sprintf("%.2f",$nums[2]['nums']/$rnum)*100}>%<{else}>0%<{/if}></span></li>
            <li class="reserve" onclick="sou(3)">预定<span> | <{if isset($nums[3]['nums'])}><{$nums[3]['nums']}><{else}>0<{/if}>间 | <{if isset($nums[3]['nums'])}><{sprintf("%.2f",$nums[3]['nums']/$rnum)*100}>%<{else}>0%<{/if}></span></li>
            <li class="sweep" onclick="sou(4)">打扫<span> | <{if isset($nums[4]['nums'])}><{$nums[4]['nums']}><{else}>0<{/if}>间 | <{if isset($nums[4]['nums'])}><{sprintf("%.2f",$nums[4]['nums']/$rnum)*100}>%<{else}>0%<{/if}></span></li>
        </ul>
        <ul class="menu">
            <{foreach from=$rooms item=v key=k}>
            <li class="<{$colors[$v.rtype]}> menu_room" onclick="showdiv('<{$v.rtype}>',this,<{$v.id}>);" id="r_<{$v.id}>"><p><{$v.name}></p><p tid="<{$v.tid}>"><{$v.tname}></p></li>
            <{/foreach}>
       </ul>

    </div>
</div>
</div>
<!--弹出层-->
 <div class="layer_today" id="layer"></div>
   <div class="layer_day">
        <div class="layer_top">
            <h3>客房信息</h3>
            <a href="#"><i class="layer_close quxiao" id="floor_close"></i></a></div>
        <form action="?m=order&a=directOrder" method="post" id="myform" onsubmit="return submitTest();">
       <div class="layer_inner">
          <div class="layer_foot">
            <ul class="layer_center">
                <li>
                    <span>房型:<input type="text" readonly class="center-01"/><input type="hidden" name="tid" class="center-01"/></span>
                </li>
                <li>房号:<input type="text" class="center-01" name="rhao" readonly/></li>
                <li>会员卡号:<input type="text" class="center-02" name="vip_num"/></li>
            </ul>
            <ul class="layer_center">
                <li>房价:<input type="text" readonly class="center-01 grey" id="layer_today_amount" name="amount"/></li>
                <li>折扣价:<input type="text" class="center-03"/></li>
                <li><span>房价方案:</span>
                    <input type="text" readonly id="proid" class="grey"/>
                    <input type="hidden" name="proid" id="proval"></li>
            </ul>
            <ul class="layer_center layer_center01">
                <li>预入时间:<input type="text" class="center-05" id="layer_in_time" name="in_time" onchange="getprice();" onclick="WdatePicker({startDate:'',dateFmt:'yyyy-MM-dd'})"/></li>
                <li class="day_num">预住天数:&nbsp;&nbsp;&nbsp;<span id="daySpan" style="background-color: #e3e3e3; cursor: default;">0</span></li>
                <li>预离时间:<input type="text" class="center-05" id="layer_out_time" name="out_time" onchange="getprice();" onclick="WdatePicker({startDate:'',dateFmt:'yyyy-MM-dd'})"/></li>
            </ul>
        </div>
        <div class="layer_box">
            <table border="0" cellspacing="0" cellpadding="0" width="100%">
                <thead>
                <tr>
                    <th class="w-100">姓名</th>
                    <th class="w-100">姓别</th>
                    <th class="w-150">出生年月</th>
                    <th class="w-100">证件类型</th>
                    <th class="num">证件号码</th>
                    <th class="w-100">操作</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td class="w-100"><input class="pername" type="text" name="pername[]"/></td>
                    <td><select name="persex[]">
                        <option value="男">男</option>
                        <option value="女">女</option>
                    </select></td>
                    <td><input type="text" name="brithday[]"/></td>
                    <td><select>
                        <option value="1">身份证</option>
                    </select></td>
                    <td><input type="text" class="num-01" name="pernum[]"/></td>
                    <td class="color" onclick="removetr(this)"> 删除 </td>
                </tr>
                <tr>
                    <td class="w-100"><input type="text" class="pername" name="pername[]"/></td>

                    <td><select name="persex[]">
                        <option value="男">男</option>
                        <option value="女">女</option>
                    </select></td>
                    <td><input type="text" name="brithday[]"/></td>
                    <td><select>
                        <option value="1">身份证</option>
                    </select></td>
                    <td><input type="text" class="num-01" name="pernum[]"/></td>
                    <td class="color" onclick="removetr(this)"> 删除 </td>
                </tr>
                </tbody>
            </table>
            <span class="sign">+</span>
        </div>
        <div class="layer_bottom" style="width:auto;">
            <span>支付方式:</span>
            <select class="center-01" name="pay_type">
            	<{foreach from=$pay_type item=aa key=bb}>
                    <option value="<{$bb}>"><{$aa}></option>
                <{/foreach}>
            </select>
            <span class="bottom-01">押金:<input type="text" class="center-01" name="cash"/></span>
            <span class="bottom-01">联系电话:<input type="text" class="center-01" name="create_phone"/></span>
            <div class="textarea-box"><p>备注：</p><textarea name="remark"></textarea>
            <div style="color: red;margin-left:20px">友情提示：一旦点击开房按钮，房间就被入住了呦~</div>
            </div>
       </div>
         <div class="sum"><input type="submit" value="开房"> <input type="button" value="关闭" class="quxiao"/></div>
       </div>
            <input type="hidden" name="room_id" id="room_id"/>
        </form>

<script type="text/javascript" src='<{$ipath}>app/hotel/js/My97DatePicker/WdatePicker.js'></script>
<script type="text/javascript" src='<{$ipath}>app/hotel/js/jquery-1.7.2.min.js'></script>
<script src="<{$ipath}>app/hotel/js/mask.js"></script>
<script type="text/javascript" src='<{$ipath}>app/hotel/js/room_storey.js'></script>
<script type="text/javascript">


       function showdiv(rtype,obj,room_id){
				if(rtype=='1'){
					$(".layer_today").show();
					$(".layer_day").show();


                    var num=$(obj).find('p').eq(0).text();
                    var num=$(obj).find('p').eq(0).text();
                    var num=$(obj).find('p').eq(0).text();

					var tid=$(obj).find('p').eq(1).attr('tid');
					var psel = '';
					var url = '?m=manage&a=getProInfo&id='+room_id;
				    $.get(url,function(data){
				        $('#proid').attr('data-p',data.pacific_price);
				        $('#proid').attr('data-w',data.weekend_price);
				        $('#proid').attr('data-s',data.special_price);
					$('#proid').val(data.name);
					$('#proval').val(data.id);
				    },'json');
					var tname=$(obj).find('p').eq(1).text();
					$(".layer_foot").find('ul').eq(0).find('input').eq('0').val(tname);
					$(".layer_foot").find('ul').eq(0).find('input').eq('1').val(tid);
					$(".layer_foot").find('ul').eq(0).find('input').eq('2').val(num);
				}
				$('#room_id').val(room_id);
			}

			$(".quxiao").click(function(){
                $(".layer_today").hide();
                $(".layer_day").hide();

                $("#myform")[0].reset();
                $("#daySpan").html(0);
            })

		$(".quxiao").click(function(){
                $(".layer_today").hide();
                  $(".layer_day").hide();

                 $("#myform")[0].reset();
                $("#daySpan").html(0);
            })

		$(".quxiao").click(function(){
			$(".layer_today").hide();
			$(".layer_day").hide();

			$("#myform")[0].reset();
			$("#daySpan").html(0);
		})

            /* $(".menu_room").click(function(){
                $(".layer_today").show();
                 $(".layer_day").show();
                
            })*/
                $('.empty').click(function(){
                    $(".blue").show().siblings().not('.blue').hide();
                });
                $('.reside').click(function(){
                    $(".red").show().siblings().not('.red').hide();
                });
                $('.reserve').click(function(){
                    $(".green").show().siblings().not('.green').hide();
                });
                $('.sweep').click(function(){
                    $(".gray").show().siblings().not('.gray').hide();
                });
                $('.total').click(function(){
                    $('.tab li').show();
                });
 	$(".sign").click(function(){
 		var str='<tr><td><input type="text" class="pername" name="pername[]"/></td><td><select name="persex[]"><option value="男">男</option><option value="女">女</option></select></td><td><input type="text" name="brithday[]"/></td><td><select><option value="1">身份证</option></select></td><td><input type="text" class="num-01" name="pernum[]"/></td><td class="color" onclick="removetr(this)"> 删除 </td></tr>';
 		$(".layer_box").find('table').append(str);
 	})
 	function removetr(obj){
 		if($(".color").size()<=1){
 			alert('请最少保留一个！');return;
 		}
 		$(obj).parent('tr').remove();
 	}
    function sou(type){
        window.location.href='?m=manage&a=index&rtype='+type;
    }
	
    function getprice(){
    	var in_time = $('#layer_in_time').val();
    	var out_time = $('#layer_out_time').val();
    	var fid = $('#proval').val();
    	if(fid != '' && in_time != '' && out_time != ''){
            var reg=new RegExp("-","g");
            if(parseInt(in_time.replace(reg,''))>parseInt(out_time.replace(reg,''))){
                var tempstr = '';
                tempstr = out_time;
                out_time = in_time;
                in_time = tempstr;
                $('#layer_in_time').val(in_time);
                $('#layer_out_time').val(out_time);
            }
    		var url = "?m=order&a=getPrices";
    		var data = {
    			'in_time':in_time,
    			'out_time':out_time,
    			'pid':fid,
    			'num':1
    		};
    		$.post(url,data,function(data){
    			$('#layer_today_amount').val(data.prices);
    		},'json');
    	}
    	if(in_time != '' && out_time != ''){
    		var url = "?m=order&a=getDayNum";
    		var data = {
    			'in_time':in_time,
    			'out_time':out_time
    		};
    		$.post(url,data,function(data){
    			$('#daySpan').html(data);
    		});
    	}
    }
	
	function submitTest(){
        var falg=1;
		var in_time = $("input[name='in_time']"),
			out_time = $("input[name='out_time']"),
			cash = $("input[name='cash']"),
			create_phone = $("input[name='create_phone']");
		if (in_time.val()==""){
			alert('请输入预入时间');
			return false;
		}
		if (out_time.val()==""){
			alert('请输入预离时间');
			return false;
		}
		if (cash.val()!=""){
		    if (!isNum(cash.val())) {
			alert('押金必须为数字');
			return false;
		    }
		}
		if (create_phone.val()==""){
			alert('请输入联系电话');
			return false;
		}
        $(".pername").each(function(){
            if($(this).val()==''){
                falg=0;
            }
        });
        $(".num-01").each(function(){
            if($(this).val()==''){
                falg=0;
            }
        });
        if(!falg){
            alert('请将住客信息填写完整');
            return false;
        }
	}

    </script>
</body>
</html>